﻿@model NewsLetterSubscriptionListModel
@using Telerik.Web.Mvc.UI
@{
    ViewBag.Title = T("Admin.Promotions.newsLetterSubscriptions").Text;
}
<div class="section-header">
    <div class="title">
        <i class="far fa-envelope"></i>
        @T("Admin.Promotions.newsLetterSubscriptions")
    </div>
    <div class="options">
		@{ Html.RenderWidget("admin_button_toolbar_before"); }

        @{ Html.RenderWidget("admin_button_toolbar_after"); }
    </div>
</div>

<div class="row mt-3 grid-filter">
	<div class="col-sm-6 col-lg-4 col-xl-3 form-group">
		@Html.SmartLabelFor(model => model.SearchEmail)
		@Html.TextBoxFor(model => Model.SearchEmail, new { @class = "form-control" })
	</div>
	@if (Model.AvailableStores.Count > 1)
	{
		<div class="col-sm-6 col-lg-4 col-xl-3 form-group">
			@Html.SmartLabelFor(model => model.StoreId)
			@Html.DropDownListFor(model => model.StoreId, Model.AvailableStores, T("Admin.Common.All"), new { @class = "form-control" })
		</div>
	}
	<div class="col-sm-6 col-lg-4 col-xl-3 form-group">
		@Html.SmartLabel(string.Empty, string.Empty)
		<button type="submit" id="search-newsLetterSubscriptions" value="search-newsLetterSubscriptions" class="btn btn-secondary btn-block">
			<span>@T("Admin.Common.ApplyFilter")</span>
		</button>
	</div>
</div>

<div>
	@(Html.Telerik().Grid<NewsLetterSubscriptionModel>(Model.NewsLetterSubscriptions.Data)
		.Name("newsLetterSubscriptions-grid")
		.DataKeys(x =>
		{
			x.Add(y => y.Id).RouteKey("Id");
		})
		.Columns(columns =>
		{
			columns.Bound(x => x.Email)
				.Width(500);
			columns.Bound(x => x.Active)
				.Template(item => @Html.SymbolForBool(item.Active))
				.ClientTemplate(@Html.SymbolForBool("Active"))
				.Centered()
				.Width(100);
			columns.Bound(x => x.StoreName)
				.Hidden(Model.AvailableStores.Count <= 1)
				.ReadOnly();
			columns.Bound(x => x.CreatedOn)
				.ReadOnly()
				.Width(150);
			columns.Command(commands =>
			{
				commands.Edit().Localize(T);
				commands.Delete().Localize(T);
			})
			.HtmlAttributes(new { align = "right", @class = "omega" })
			.Width(220);
		})
		.Pageable(settings => settings.Total(Model.NewsLetterSubscriptions.Total).PageSize(Model.GridPageSize).Position(GridPagerPosition.Both))
		.DataBinding(dataBinding => dataBinding.Ajax()
			.Select("SubscriptionList", "NewsLetterSubscription")
			.Update("SubscriptionUpdate", "NewsLetterSubscription")
			.Delete("SubscriptionDelete", "NewsLetterSubscription"))
			.ClientEvents(events => events.OnDataBinding("onDataBinding"))
			.ClientEvents(x => x.OnError("grid_onError"))
		.PreserveGridState()
		.EnableCustomBinding(true))
</div>

<script type="text/javascript">
    $(document).ready(function () {
        $('#search-newsLetterSubscriptions').click(function () {
            var grid = $('#newsLetterSubscriptions-grid').data('tGrid');
            grid.currentPage = 1; //new search. Set page size to 1
            grid.ajaxRequest();
            return false;
        });
    });

    function onDataBinding(e) {
        var searchModel = {
        	SearchEmail: $('#@Html.FieldIdFor(model => model.SearchEmail)').val(),
        	StoreId: $('#@Html.FieldIdFor(model => model.StoreId)').val(),
        };
        e.data = searchModel;
    }

    function grid_onError(e) {
        alert(e.XMLHttpRequest.responseText);
        e.preventDefault();
    }
</script>